<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
<div class="box">box标签</div>
<div class="wrap">
    <span>span1</span>
    <span>span2</span>
    <span>span3</span>
</div>

<input type="text" class="user" value="输入账号">
<select class="sex">
    <option value="1">男</option>
    <option value="0">女</option>
</select>

<script>
// 非表单元素：div p h2 a span em strong ...
// 表单元素：input select textarea

// 获取元素
var user = document.querySelector('.user');
var sex = document.querySelector('.sex');

// 获取元素节点的值：
// console.log( user.value );// '输入账号'

// 获取下拉列表的值时：
// 返回选中的option的value值
// 如果option没有value属性，则返回option标签内的值
// console.log( sex.value );// '0'  '1'


// 设置元素节点的值：给value属性赋值
user.value = 'xiaocuo';
sex.value = '0';


</script>
</body>
</html>